<ion-view show-tabs>
	<ion-nav-title>{{theUser.profile.name}}</ion-nav-title>
	<ion-nav-buttons side="right">
    	<button class="button"
    	 ng-class="{'button-icon ion-ios-more':!$root.isEdit,'button-clear':$root.isEdit}"
    	 ng-click="eRouter($event)">
			<span ng-if="$root.isEdit">取消</span>
    	</button>
    	<button class="button button-icon ion-navicon rotate90" menu-toggle="right"></button>
	</ion-nav-buttons>
    <ion-content class="wrap-light2">
		<ion-list>
			<form name="employeeForm" ng-submit="$root.toggleEdit();update();" ng-class="{'editing':$root.isEdit}" novalidate>

				<ion-item class="item-base">
				    <span class="list-label">账号</span>
				    <span ng-if="theUser.state!='未启用'">{{theUser.username}}</span>
					<span class="item-note" ng-if="!$root.isEdit">{{theUser.state}}</span>
				</ion-item>

				<ion-item class="item-base" ng-if="!$root.isEdit">
				    <span class="list-label">姓名</span>
				    <span>{{theUser.profile.name}}</span>
				    <i class="icon dark2 padding-left" ng-class="{'ion-male': theUser.profile.sex=='男','ion-female': theUser.profile.sex=='女'}"></i>
				    <span class="item-note" ng-class="{'balanced':theUser.profile.state=='在职'}">{{theUser.profile.state}}</span>

				</ion-item>


				<ion-item class="item-input" ng-if="$root.isEdit">
				    <span class="list-label">姓名</span>
				    <input type="text" name="name" maxlength="20" required placeholder="姓名" ng-model="theUser.profile.name" auto-focus>
				    <span class="ion-minus-circled" ng-show="employeeForm.name.$dirty && employeeForm.name.$invalid "></span>
				</ion-item>

				<ion-item class="item-input" ng-if="theUser.emails[0].address">
				    <span class="list-label">邮箱</span>
				    <input type="email" name="email" maxlength="30" placeholder="工作邮箱" ng-readonly="!$root.isEdit" ng-model="theUser.emails[0].address">
				    <span class="item-note" ng-if="!$root.isEdit">工作</span>
				    <span class="ion-minus-circled" ng-show="employeeForm.email.$dirty && employeeForm.email.$invalid "></span>
				</ion-item>

				<ion-item class="item-base">
					<span class="list-label">部门</span>
					<span ng-repeat="dept in theUser.profile.departments track by $index">{{dept.name}}</span>
				</ion-item>

				<ion-item class="item-base">
					<span class="list-label">职能</span>
					<span>{{theUser.profile.roleName}}</span>
				</ion-item>


				<ion-item class="item item-divider margin-top-large" ng-click="toggleFeilds()">
				    详细资料
				    <i class="pull-right" ng-class="{'ion-ios-arrow-up':isBlockShown,'ion-ios-arrow-down':!isBlockShown}"></i>
				</ion-item>
	  			<div ng-show="isBlockShown">
					<ion-item class="item-input item-icon-right radio-group" ng-class="{'item-icon-left':!$root.isEdit}" ng-if="$root.isEdit">
						<span class="list-label">性别</span>
					    <ion-radio ng-model="theUser.profile.sex" ng-value="'男'" class="radio-royal">男</ion-radio>
		            	<ion-radio ng-model="theUser.profile.sex" ng-value="'女'" class="radio-royal">女</ion-radio>
					    <span class="ion-minus-circled" ng-show="employeeForm.sex.$invalid "></span>
					</ion-item>


					<ion-item class="item-input" ng-if="$root.isEdit">
					    <span class="list-label">生日</span>
					    <input type="date" name="birthday" required placeholder="生日" ng-model="theUser.profile.birthday">
					    <span class="ion-minus-circled" ng-show="employeeForm.birthday.$dirty && employeeForm.birthday.$invalid "></span>
					</ion-item>
					<ion-item class="item-base item-icon-left" ng-if="theUser.profile.birthday && !$root.isEdit">
					    <i class="icon ion-ios-heart-outline dark2"></i>
					    <span>{{theUser.profile.birthday | amDateFormat:'YYYY-MM-DD'}}</span>
					    <span class="item-note">{{(theUser.profile.birthday | amDifference : null : 'years') * -1 }}岁</span>
					</ion-item>

					<ion-item class="item-input" ng-if="$root.isEdit">
					    <span class="list-label">住址</span>
					    <input type="text" name="province" maxlength="10" required placeholder="省" ng-model="theUser.profile.address.province" />
					    <input type="text" name="city" maxlength="10" required placeholder="市" ng-model="theUser.profile.address.city" />
					    <input type="text" name="region" maxlength="10" required placeholder="区" ng-model="theUser.profile.address.region" />
					</ion-item>
					<ion-item class="item-input item-borderless" ng-if="$root.isEdit">
						<span class="list-label"></span>
						<input type="text" name="street" maxlength="50" required placeholder="详细地址" ng-model="theUser.profile.address.street" />
					</ion-item>
					<ion-item class="item-base item-icon-left" ng-if="theUser.profile.address && !$root.isEdit">
					    <i class="icon ion-ios-location-outline dark2"></i>
					    <span>{{theUser.profile.address.province}}</span>
					    <span>{{theUser.profile.address.city}}</span>
					    <span>{{theUser.profile.address.region}}</span>
					    <span>{{theUser.profile.address.street}}</span>
					</ion-item>

					<ion-item class="item-input" ng-class="{'item-icon-left':!$root.isEdit}" ng-repeat="phone in theUser.profile.phones track by $index" ng-if="theUser.profile.phones[$index].number || $root.isEdit">
					    <i class="icon ion-iphone dark2" ng-if="!$root.isEdit"></i>
					    <span class="list-label" ng-if="$root.isEdit">手机{{$index + 1}}</span>
					    <input type="text" name="label{{$index}}" maxlength="5" required placeholder="标签" ng-model="phone.label" ng-if="$root.isEdit">
					    <input type="text" name="phone{{$index}}" maxlength="11" required placeholder="手机号码" ng-model="phone.number" ng-readonly="!$root.isEdit">
					    <span ng-if="!$root.isEdit" class="item-note">{{phone.label}}</span>
					    <span class="ion-minus-circled" ng-show= "employeeForm.phone[$index].number.$dirty && employeeForm.phone[$index].number.$invalid "></span>
					</ion-item>

					<ion-item class="item-input" ng-class="{'item-icon-left':!$root.isEdit}" ng-if="theUser.profile.email || $root.isEdit">
					    <i class="icon ion-ios-email-outline dark2" ng-if="!$root.isEdit"></i>
					    <span class="list-label" ng-if="$root.isEdit">私人邮箱</span>
					    <input type="email" name="email" maxlength="30" required placeholder="私人邮箱" ng-model="theUser.profile.email" ng-readonly="!$root.isEdit">
					    <span class="item-note" ng-if="!$root.isEdit">私人</span>
					    <span class="ion-minus-circled" ng-show="employeeForm.email.$dirty && employeeForm.email.$invalid "></span>
					</ion-item>

					<ion-item class="item-input light-bg" ng-if="theUser.profile.remark || $root.isEdit">
						<span class="list-label">备注</span>
						<textarea rows="3" ng-model="theUser.profile.remark" ng-readonly="!$root.isEdit"></textarea>
					</ion-item>

				</div>
		        <button class="button button-block button-balanced" ng-if="$root.isEdit" type="submit">保存</button>

			</form>

			<div class="button-bar margin-top" ng-if="!$root.isEdit">
			  <a class="button button-light" href="tel:{{theUser.profile.phones[0].number || theUser.profile.phones[1].number}}" ng-if="theUser.profile.phones[0].number || theUser.profile.phones[1].number"><i class="icon ion-ios-telephone-outline"></i> 拨号</a>
			  <a class="button balanced" ng-if="false"><i class="icon ion-ios-chatboxes-outline" ng-click="message()"></i> 通知</a>
			</div>

		</ion-list>
	</ion-content>
</ion-view>

